<template>
  <div class="chongfudingdan">
    <el-button type="danger" style="margin-bottom: 20px;" round @click="bianji()">添加处理规则</el-button>
    <el-table :data="list2" border style="width: 100%">
      <el-table-column prop='applied_range' label="规则应用范围"></el-table-column>
      <el-table-column prop='compare_info' label="比对信息"></el-table-column>
      <el-table-column prop='source_rand' label="比对来源范围"></el-table-column>

      <el-table-column prop='handle_type' label="重复订单操作"></el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button type="text" @click="bianji(scope.row)">编辑</el-button>
          <el-button type="text" @click="shanchulaiyuan(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>


    <div class="fenye" style="padding: 20px; text-align: right;">
      <el-pagination background layout="total, sizes, prev, pager, next, jumper" :page-sizes="[5, 10, 20, 50]" @size-change="fanye" @current-change="handleCurrentChange" :current-page="search.page" :page-size="search.page_size" :total="total"></el-pagination>
    </div>

    <el-dialog title="添加处理规则"  :visible.sync="log" center width="1000px" :close-on-click-modal="false"
      :close-on-press-escape="false">

      <div class="kflexc" style="margin-bottom: 20px;">
        <div style="width: 180px; margin-right: 20px; color: #666666; font-size: 14px;">规则应用范围</div>
        <div>
          <el-select v-model="all.out_store_id" clearable filterable placeholder="选择销售渠道分类">
            <el-option :label="item.channel_name" :value="item.id" v-for="item in qudaolists"
              :key="item.id"></el-option>
          </el-select>
          <el-select v-model="all.channel_id" clearable filterable placeholder="选择店铺">
            <el-option :label="item.shop_name" :value="item.id" v-for="item in qudaolists2" :key="item.id"></el-option>
          </el-select>
        </div>
      </div>
      <div class="kflexc" style="margin-bottom: 20px;">
        <div style="width: 180px; margin-right: 20px; color: #666666; font-size: 14px;">订单重复的检索信息</div>
        <div>
          <el-checkbox v-model="all.mobile" :true-label="1" :false-label="0">手机号</el-checkbox>
          <el-checkbox v-model="all.id_card" :true-label="1" :false-label="0">身份证号</el-checkbox>
        </div>
      </div>
      <div class="kflexc" style="margin-bottom: 20px;">
        <div style="width: 180px; margin-right: 20px; color: #666666; font-size: 14px;">订单重复的检索销售范围</div>
        <div>
          <el-radio v-model="all.source_rand" :label="1">本店铺所有订单</el-radio>
          <el-radio v-model="all.source_rand" :label="2">销售渠道分类</el-radio>
          <el-popover style="margin-right: 20px;" placement="top-start" title="" width="500" trigger="hover"
            content="订单重复检测其所属的销售渠道，例如抖音、快手、天猫，超出范围不检测">
            <i slot="reference" style="color: #000;" class="el-icon-question"></i>
          </el-popover>
          <el-radio v-model="all.source_rand" :label="3">销售店铺</el-radio>
        </div>
      </div>
      <!--    <div class="kflexc" style="margin-bottom: 20px;">
            <div style="width: 180px; margin-right: 20px; color: #666666; font-size: 14px;">订单重复的检索商品范围</div>
            <div>
              <el-radio v-model="all.goods" :label="1">所属产品</el-radio>
              <el-radio v-model="all.goods" :label="2">所属商品</el-radio>
              <el-radio v-model="all.goods" :label="3">全部</el-radio>
            </div>
          </div> -->
      <div class="kflexc" style="margin-bottom: 20px;">
        <div style="width: 180px; margin-right: 20px; color: #666666; font-size: 14px;">订单重复的检索时间范围</div>
        <div>
          <el-radio v-model="all.day_rand" :label="1">1天</el-radio>
          <el-radio v-model="all.day_rand" :label="2">3天</el-radio>
          <el-radio v-model="all.day_rand" :label="3">5天</el-radio>
          <el-radio v-model="all.day_rand" :label="4">7天</el-radio>
          <el-radio v-model="all.day_rand" :label="5">10天</el-radio>
          <el-radio v-model="all.day_rand" :label="6">15天</el-radio>
          <el-radio v-model="all.day_rand" :label="7">30天</el-radio>
        </div>
      </div>
      <div class="kflex" style="margin-bottom: 20px;">
        <div style="width: 180px; margin-right: 20px; color: #666666; font-size: 14px;">检测到订单重复时的操作</div>
        <div>
          <div style="margin-bottom: 20px;">
            <el-radio v-model="all.handle_type" :label="1" style="margin-bottom: 10px;">
              生产失败
              <el-checkbox v-model="all.handle_origin1" :disabled="all.handle_type != 1" style="margin-left: 50px;" :true-label="1" :false-label="0">原订单一并失败</el-checkbox>
              <el-popover style="margin-right: 20px;" placement="top-start" trigger="hover"
                content="原订单和重复订单都生产失败，一单不发">
                <i slot="reference"  style="color: #000;" class="el-icon-question"></i>
              </el-popover>
            </el-radio>
            <div style="color: #999999; font-size: 12px; padding-left: 30px;">仅生产失败，失败原因为：订单重复，订单参与后续流转</div>
          </div>

          <div style="margin-bottom: 20px;">
            <el-radio v-model="all.handle_type"  :label="2" style="margin-bottom: 10px;">
              置为重复待清理
              <el-checkbox v-model="all.handle_origin2" :disabled="all.handle_type != 2" style="margin-left: 50px;" :true-label="1" :false-label="0">原订单一并失败</el-checkbox>
              <el-popover style="margin-right: 20px;" placement="top-start" trigger="hover"
                content="原订单和重复订单都置为“重复待清理”，一单不发">
                <i slot="reference"  style="color: #000;" class="el-icon-question"></i>
              </el-popover>
            </el-radio>
            <div style="color: #999999; font-size: 12px; padding-left: 30px;">订单不会参与之后的所有流程，包括：外呼、短信、转单等，但会被报表等统计</div>
          </div>

          <div style="margin-bottom: 20px;">
            <el-radio v-model="all.handle_type"   :label="3" style="margin-bottom: 10px;">
              删除订单
              <el-checkbox v-model="all.handle_origin3" :disabled="all.handle_type != 3" style="margin-left: 50px;" :true-label="1" :false-label="0">原订单一并失败</el-checkbox>
              <el-popover style="margin-right: 20px;" placement="top-start" trigger="hover"
                content="原订单和重复订单一起删除，谨慎使用">
                <i slot="reference"  style="color: #000;" class="el-icon-question"></i>
              </el-popover>
            </el-radio>
            <div style="color: #999999; font-size: 12px; padding-left: 30px;">订单直接删除，不会被统计</div>
          </div>
        </div>
      </div>

      <div style="color: #f00;">注：下单时间最早的订单定义为原订单，之后下单的定义为重复订单。</div>

      <span slot="footer" class="dialog-footer">
        <el-button round @click="log = false">关闭</el-button>
        <el-button round type="danger" @click="postlist()">添加</el-button>
      </span>
    </el-dialog>




  </div>
</template>

<script>
  import axios from "axios";
  export default {
    name: 'chongfudingdan',
    data() {
      return {
        search:{
          page:1,
          page_size:20
        },
        total:0,
        log: false,
        list2: [],
        all: {
          id:"",
          mobile: 0,
          id_card: 0,
          source_rand: 0,
          goods: 0,
          day_rand: 0,
          handle_type: 0,
          out_store_id: "",
          channel_id: "",
          handle_origin1:"",
          handle_origin2:"",
          handle_origin3:""
        },
        qudaolists: [],
        qudaolists2: []
      }
    },
    created() {
      this.getxiala()
      this.getlist()
    },
    methods: {
      handleCurrentChange:function(val){
        this.search.page = 1
        this.search.page_size = val
        this.getlist()
      },
      fanye:function(page){
      	this.search.page = page
      	this.getlist()
      },
      shanchulaiyuan: function(item) {
        this.$confirm('此操作将永久删除, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          axios.post('/api/plan-market/shop/delete/repeat/order/config', {
              id: item.id
            })
            .then(response => {
              if (response.data.msg.code == 0) {
                this.$message.success('已删除！');
                this.getlist()
              } else {
                this.$message.error(response.data.msg.info);
              }
            })
        })
      },
      bianji: function(item) {
        if (item) {
          axios.get('/api/plan-market/shop/get/repeat/order/config?id=' + item.id)
            .then(response => {
              if (response.data.msg.code == 0) {
                this.all = response.data.data
                this.log = true
              } else {
                this.$message.error(response.data.msg.info);
              }
            })
        } else {
          this.all = {
            mobile: 0,
            id_card: 0,
            source_rand: 0,
            goods: 0,
            day_rand: 0,
            handle_type: 0,
            out_store_id: "",
            channel_id: "",
            handle_origin1:"",
            handle_origin2:"",
            handle_origin3:""
          }
          this.log = true
        }
      },
      //获取列表
      getxiala: function() {
        this.loading = true
        axios.get('/api/form/channels?page=1&page_size=2000')
          .then(response => {
            if (response.data.msg.code == 0) {
              this.qudaolists = response.data.data.data
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
        axios.get('/api/plan-market/outer/store/list')
          .then(response => {
            if (response.data.msg.code == 0) {
              this.qudaolists2 = response.data.data
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },


      getlist: function() {
        axios.get('/api/plan-market/shop/get/repeat/order/config/list',{params:this.search})
          .then(response => {
            if (response.data.msg.code == 0) {
              this.list2 = response.data.data.data
              this.total = response.data.data.total
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },

      postlist: function() {
        axios.post('/api/plan-market/shop/set/repeat/order/config', this.all)
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success('保存成功');
              this.log = false
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
    }
  }
</script>

<style lang="scss" scoped>
  .chongfudingdan {
    padding: 20px;
  }
</style>
